<template>
    <div class="logo">
        <a href="#" class="left"></a>
        <a href="#" class="right"></a>
    </div>
</template>

<script>
export default {
    name:"logo",

}
</script>

<style scoped>
.logo {
  width: 100vw;
  height: 14.26666667vw;
  border-bottom: 0.13333333vw solid #f1f1f1;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.logo .left {
  width: 26.66666667vw;
  height: 8.66666667vw;
  margin-left: 2vw;
  background: url(https://ssr-static.msstatic.com/h5/mobile/@public-online/imgs/header/logo.acc780e7a19f22c1d8e89805488fcfef.png) no-repeat center / 100%;
}
.logo .right {
  width: 11.33333333vw;
  height: 7.46666667vw;
  margin-right: 2.93333333vw;
  background: #f4f4f4 url(https://ssr-static.msstatic.com/h5/mobile/@public-online/imgs/header/search_icon.90973681dd869f45dd50025bfac1cfde.png) no-repeat center / 4.4vw 4.13333333vw;
  border-radius: 2.93333333vw;
}
</style>